<!DOCTYPE html>
<html lang="en"  xmlns:th="http://www.thymeleaf.org">

<!--头部导航栏-->
<nav class="navbar navbar-dark sticky-top bg-dark flex-md-nowrap p-0" th:fragment="topbar">
    <a class="navbar-brand col-sm-3 col-md-2 mr-0" href="">[[${session.loginUsername}]]</a>
    <input class="form-control form-control-dark w-100" type="text" placeholder="Search" aria-label="Search">
    <ul class="navbar-nav px-3">
        <li class="nav-item text-nowrap">
            <a class="nav-link" th:href="@{/user/logOut}">Sign out</a>
        </li>
    </ul>
</nav>

<!--侧边导航栏-->
        <nav class="col-md-2 d-none d-md-block bg-light sidebar" th:fragment="sidebar">
          <div class="sidebar-sticky">
            <ul class="nav flex-column">
              <li class="nav-item">
                <a th:class="${active=='main.html'? 'nav-link active':'nav-link '}" th:href="@{/dashboard}">
                  <span data-feather="home"></span>
                  Dashboard <span class="sr-only">(current)</span>
                </a>
              </li>
<!--              <li class="nav-item">-->
<!--                <a class="nav-link" href="#">-->
<!--                  <span data-feather="file"></span>-->
<!--&lt;!&ndash;                  Orders&ndash;&gt;-->
<!--                </a>-->
<!--              </li>-->
<!--              <li class="nav-item">-->
<!--                <a class="nav-link" href="#">-->
<!--                  <span data-feather="shopping-cart"></span>-->
<!--&lt;!&ndash;                  Products&ndash;&gt;-->
<!--                </a>-->
<!--              </li>-->
              <li class="nav-item">
                <a th:class="${active=='emp.html'? 'nav-link active':'nav-link '}" th:href="@{/list}">
                  <span data-feather="users"></span>
                  员工
                </a>
              </li>
<!--              <li class="nav-item">-->
<!--                <a class="nav-link" href="#">-->
<!--                  <span data-feather="bar-chart-2"></span>-->
<!--&lt;!&ndash;                  Reports&ndash;&gt;-->
<!--                </a>-->
<!--              </li>-->
<!--              <li class="nav-item">-->
<!--                <a class="nav-link" href="#">-->
<!--                  <span data-feather="layers"></span>-->
<!--&lt;!&ndash;                  Integrations&ndash;&gt;-->
<!--                </a>-->
<!--              </li>-->
<!--            </ul>-->

<!--            <h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-muted">-->
<!--              <span>Saved reports</span>-->
<!--              <a class="d-flex align-items-center text-muted" href="#">-->
<!--                <span data-feather="plus-circle"></span>-->
<!--              </a>-->
<!--            </h6>-->
<!--            <ul class="nav flex-column mb-2">-->
<!--              <li class="nav-item">-->
<!--                <a class="nav-link" href="#">-->
<!--                  <span data-feather="file-text"></span>-->
<!--&lt;!&ndash;                  Current month&ndash;&gt;-->
<!--                </a>-->
<!--              </li>-->
<!--              <li class="nav-item">-->
<!--                <a class="nav-link" href="#">-->
<!--                  <span data-feather="file-text"></span>-->
<!--&lt;!&ndash;                  Last quarter&ndash;&gt;-->
<!--                </a>-->
<!--              </li>-->
<!--              <li class="nav-item">-->
<!--                <a class="nav-link" href="#">-->
<!--                  <span data-feather="file-text"></span>-->
<!--&lt;!&ndash;                  Social engagement&ndash;&gt;-->
<!--                </a>-->
<!--              </li>-->
<!--              <li class="nav-item">-->
<!--                <a class="nav-link" href="#">-->
<!--                  <span data-feather="file-text"></span>-->
<!--&lt;!&ndash;                  Year-end sale&ndash;&gt;-->
<!--                </a>-->
<!--              </li>-->
            </ul>
          </div>
        </nav>
</html>